<template>
	<view>
		<view class="text-center bg-white padding">
			<image class="cu-avatar xl round margin-top" :src="job?.logo" mode="aspectFill"></image>
			<view class="margin">
				{{job?.job_title}}
			</view>
			<view class="margin">
				{{job?.company_name}} · 
				<text class="text-orange">{{job?.employment_type}}</text>
			</view>
			<view class="">
				<view class="cu-avatar round sm bg-green margin-right-xs">
					<text class="iconfont icon-a-001_weizhi"></text>
				</view>
				{{job?.location}}
			</view>
		</view>
		
		<!-- <custom-tab /> -->
		
		<!-- 岗位信息 -->
		<view class="job-detail margin-top-xs">
			<view class="padding bg-white">
				<view class="text-bold">
					岗位描述
				</view>
				<view class="text-grey">
					{{job?.description}}
				</view>
			</view>
			
			<view class="padding bg-white margin-top-xs">
				<view class="text-bold">
					任职要求
				</view>
				<view class="text-grey" v-for="(item,index) in job?.requirements">
					{{index+1}}、{{item}}
				</view>
			</view>
			<view class="padding bg-white margin-top-xs">
				<view class="text-bold">
					技能要求
				</view>
				<view class="text-grey" v-for="(item,index) in job?.skills">
					{{index+1}}、{{item}}
				</view>
			</view>
			
		</view>
		
		
		
		<view class="cu-bar foot bg-white" >
			<button v-if="status==0" class="cu-btn bg-orange block" @click="handleJoin">
				提交报名
			</button>
			<button v-if="status==1" class="cu-btn line-grey block">
				等待审核
			</button>
			<button v-if="status==2" class="cu-btn line-cyan block">
				简历已阅
			</button>
			<button v-if="status==3" class="cu-btn line-blue block">
				预约面试
			</button>
			<button v-if="status==4" class="cu-btn line-green block">
				准备入职
			</button>
			<button v-if="status==5" class="cu-btn line-red block">
				已被拒绝
			</button>
		</view>
	</view>
</template>

<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app';
import {getJobDetail, joinCheck, joinPost} from '@/api/job_api'
import { computed, ref, type Ref } from 'vue';
import type { JobType } from '@/model/company';
import {useStore} from 'vuex'
const store = useStore()
// 携带岗位id，获取完整岗位信息
const job:Ref<JobType|null> = ref(null)
onLoad(async(options)=>{
	let jobId = options?.id || '68959bcecca5027986d287e4'
	let res = await getJobDetail(jobId)
	console.log(res);
	job.value = res.data
	
	// 2. 生命周期中初始化岗位报名状态
	let userId = uinfo.value?.objectId||''
	let joinRes = await joinCheck(userId,jobId)
	console.log('报名状态查询结果',joinRes);
	if(joinRes.data.results.length!=0){
		status.value = joinRes.data.results[0].status
	}else{
		status.value = 0
	}
})

// 1. 报名
const uinfo = computed(()=>store.state.user.uinfo)
const status = ref<number>(-1)  //控制报名按钮显示
const handleJoin = async ()=>{
	//1. 登录判断
	if(!uinfo.value||!uinfo.value.objectId){
		uni.navigateTo({
			url:'/pages/account/login'
		})
		return
	}
	//2. 信息完整性判断
	let {name,phone} = uinfo.value
	if(!name||!phone){
		uni.showModal({
			title:'个人信息不完善',
			confirmColor:'#F37B1D',
			content:'是否跳转到设置页完善个人信息？',
			success: ({confirm}) => {
				console.log(confirm);
				if(confirm){
					uni.navigateTo({
						url:'/pages/mine/setting',
					})
				}
			}
		})
		return
	}
	
	//3. 提交报名
	let userId = uinfo.value.objectId
	let jobId = job.value!.objectId!
	let {company_name,logo,job_title,location,salary_range} = job.value!
	let res = await joinPost({
		userId,jobId,status:1,
		company_name,logo,job_title,location,salary_range
	})
	if(res.data.objectId){
		status.value = 1
	}
	
	
}




</script>

<style lang="scss">
.job-detail{
	.text-grey{
		line-height: 50upx;
	}
}  
page{
	padding-bottom: 100upx;
}   
.cu-bar.foot button{
	width: 90%;
	margin-left:5%;
}
</style>
